<!DOCTYPE html>
<html>
  <head>
  	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
	<title>Moli-Magic System</title>
	
    <!-- bootstrap -->
    <link rel="stylesheet" href="__PUBLIC__/bootstrap/css/bootstrap.min.css" />
    <!-- Font Awesome -->
    <link rel="stylesheet" href="__TMPL__Public/assets/plugins/font-awesome-4.4.0/css/font-awesome.min.css" />
    <!-- Ionicons -->
    <link rel="stylesheet" href="__TMPL__Public/assets/plugins/ionicons-2.0.1/css/ionicons.min.css" />
    <!-- bootstrap-table -->
    <link rel="stylesheet" href="__TMPL__Public/assets/plugins/bootstrap-table/css/bootstrap-table.css" />
    <!-- XPopup -->
	<link rel="stylesheet" href="__PUBLIC__/xPopup/css/xpopup.css" />
    <!-- zTree -->
	<link rel="stylesheet" href="__TMPL__Public/assets/plugins/zTree/css/zTreeStyle.css" />
    <!-- jquery.validate -->
    <link rel="stylesheet" href="__PUBLIC__/jquery/jquery.validate/validate.css" />
    <!-- xupload -->
    <link rel="stylesheet" href="__TMPL__Public/assets/plugins/xUpload/css/xupload.css" />
    <!-- Date Picker -->
    <link rel="stylesheet" href="__TMPL__Public/assets/plugins/datetimepicker/css/bootstrap-datetimepicker.min.css" />
    <!-- Daterange picker -->
    <link rel="stylesheet" href="__TMPL__Public/assets/plugins/bootstrap-daterangepicker/daterangepicker.css" />
    <!-- xrs -->
    <link rel="stylesheet" href="__TMPL__Public/assets/plugins/xrs/xrs.css" />
	<!-- bootstrap-slider -->
	<link rel="stylesheet" href="__TMPL__Public/assets/plugins/bootstrap-slider/css/bootstrap-slider.css" />
	<!-- bootstrap-star-rating -->
	<link rel="stylesheet" href="__TMPL__Public/assets/plugins/bootstrap-star-rating/css/star-rating.min.css" />
    <!-- Theme style -->
    <link rel="stylesheet" href="__TMPL__Public/assets/css/AdminLTE.css" />
    <!-- AdminLTE Skins -->
    <link rel="stylesheet" href="__TMPL__Public/assets/css/skins/skin-all.css" />
    <!-- ext -->
    <link rel="stylesheet" href="__TMPL__Public/assets/css/ext.css" />
</head>
<body class="hold-transition fixed skin-purple sidebar-mini">
	<!-- XLOADING -->
	<div class="xloading with-mask-white">
		<div class="x-pacman-wrap spinner-wrap">
			<div class="spinner"></div>
	        <span class="pacman-txt">页面加载中</span>
		</div>
	</div>
	<!-- /XLOADING -->
	
    <!-- Site wrapper -->
    <div class="wrapper">
      	<!-- ======================= Header ======================== -->
		<header class="main-header">
			<!-- Logo -->
			<a href="#" class="logo">
				<!-- mini logo for sidebar mini 50x50 pixels -->
				<span class="logo-mini"><b>MMS</b></span>
				<!-- logo for regular state and mobile devices -->
				<span class="logo-lg"><b>Moli-Magic System</b></span>
	        </a>

			<!-- Header Navbar: style can be found in header.less -->
			<nav class="navbar navbar-static-top" role="navigation">
				<!-- Sidebar toggle button -->
				<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</a>
				<!-- Custom navbar menu -->
				<div class="navbar-custom-menu">
	            	<ul class="nav navbar-nav">
						<!-- Messages: style can be found in dropdown.less-->
						<li>
							<a href="__ROOT__/" title="{:L('WEBSITE_HOME_PAGE')}" target="_blank">
								<i class="fa fa-home"></i>&nbsp;{:L('WEBSITE_HOME_PAGE')}
							</a>
						</li>
						<if condition="sp_auth_check($user['id'],'Setting/Setting/clearcache')">
						<li>
							<a href="javascript:;" onclick="clearCache();" title="{:L('ADMIN_SETTING_CLEARCACHE')}">
								<i class="fa fa-trash-o"></i>&nbsp;{:L('ADMIN_SETTING_CLEARCACHE')}
							</a>
						</li>
						</if>
	             		<!-- Notifications: style can be found in dropdown.less
	             		<li class="dropdown notifications-menu">
		             		<a href="#" class="dropdown-toggle" data-toggle="dropdown">
		                  		<i class="fa fa-bell-o"></i>
		                  		<span class="label label-warning">10</span>
		                	</a>
	                		<ul class="dropdown-menu">
			                  	<li class="header">You have 10 notifications</li>
			                  	<li>
			                    	<ul class="menu">
			                      		<li>
			                        		<a href="#">
			                          			<i class="fa fa-users text-aqua"></i> 5 new customers joined today
			                        		</a>
			                      		</li>
			                    	</ul>
			                  	</li>
	                  			<li class="footer"><a href="#">View all</a></li>
							</ul>
						</li> -->
						<!-- User Account: style can be found in dropdown.less -->
	              		<li class="dropdown user user-menu">
	             			<a href="#" class="dropdown-toggle" data-toggle="dropdown">
	                  			<img alt="User Image" src="__TMPL__Public/assets/img/avatar.png" class="user-image avatar">
	                  			<span class="hidden-xs real_name">{:L('WELCOME_USER',array('username'=>empty($user['real_name'])?$user['username']:$user['real_name']))}</span>
	                		</a>
	                		<ul class="dropdown-menu">
	                  			<!-- User image -->
	                  			<li class="user-header">
	                    			<img alt="User Image" src="__TMPL__Public/assets/img/avatar.png" class="img-circle avatar">
	                    			<p>
	                      				<span class="real_name">{:$user['real_name']}</span>
	                      				<small class="username">{:$user['username']}</small>
	                  				</p>
	                  			</li>
	                  			<!-- Menu Body -->
								<li class="user-body">
	                    			<div class="col-xs-12 text-center">
	                      				<small class="email">{:$user['email']}</small>
	                  				</div>
	                 			</li>
	                  			<!-- Menu Footer-->
	                  			<li class="user-footer">
				                    <div class="pull-left">
				                      <a href="#" class="btn btn-default btn-flat" onclick="editPassword();">修改密码</a>
				                    </div>
				                    <div class="pull-right">
				                      <a href="{:U('Login/logout')}" class="btn btn-default btn-flat">退出</a>
				                    </div>
	                  			</li>
	                		</ul>
	              		</li>
	              		<!-- Control Sidebar Toggle Button -->
	              		<li>
	                		<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
	            		</li>
	              		<!-- Control Sidebar Toggle Button
	              		<li>
	                		<a href="#" class="" onclick="logoutFun()"><i class="fa fa-power-off"></i></a>
	            		</li> -->
	            	</ul>
	          	</div>
	      	</nav>
		</header>

      	<!-- ======================= Left side column. contains the sidebar ======================== -->
		<aside class="main-sidebar">
			<!-- sidebar: style can be found in sidebar.less -->
			<section class="sidebar">
				<br>
			</section><!-- /.sidebar -->
		</aside>

      	<!-- ======================= Content Wrapper. Contains page content ======================== -->
		<div class="content-wrapper">
			<!-- Content Header (Page header)
	        <section class="content-header">
	          <ol class="breadcrumb">
	          </ol>
	        </section> -->
			<section class="content">
				<!-- Main content -->
			</section>
      	</div><!-- /.content-wrapper -->

      	<!-- ======================= Main Footer ========================
		<footer class="main-footer">
        	<strong>Copyright &copy; 2015 <a target="_blank" href="http://www.jnbqs.com">江不软件</a>.</strong> All rights reserved.
        	<div class="pull-right hidden-xs">
          		Version 3.0
        	</div>
      	</footer> -->

      	<!-- ======================= Control Sidebar ======================== -->
		<aside class="control-sidebar control-sidebar-dark">
			<!-- Create the tabs -->
			<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
				<li class="active">
					<a href="#control-sidebar-theme-demo-options-tab" data-toggle="tab" aria-expanded="true"><i class="fa fa-wrench"></i></a>
				</li>
				<li class="">
					<a href="#control-sidebar-settings-tab" data-toggle="tab" aria-expanded="false"><i class="fa fa-gears"></i></a>
				</li>
			</ul>
			<!-- Tab panes -->
			<div class="tab-content">
				<!-- Demo options content -->
				<div id="control-sidebar-theme-demo-options-tab" class="tab-pane active"></div>
				<!-- /.tab-pane -->
				<!-- Settings tab content -->
				<div class="tab-pane" id="control-sidebar-settings-tab">
				</div>
				<!-- /.tab-pane -->
			</div>
		</aside>
		<!-- /.control-sidebar -->
		<!-- Add the sidebar's background. This div must be placed
       immediately after the control sidebar -->
		<div class="control-sidebar-bg"></div>
    </div><!-- ./wrapper -->

<!-- jQuery 2.1.4 -->
<script src="__PUBLIC__/jquery/jQuery-2.1.4.min.js"></script>
<!-- jquery.cookie -->
<script src="__PUBLIC__/jquery/jquery.cookie.min.js"></script>
<!-- jquery.validate -->
<script src="__PUBLIC__/jquery/jquery.validate/jquery.validate.min.js"></script>
<!-- bootstrap -->
<script src="__PUBLIC__/bootstrap/js/bootstrap.min.js"></script>
<!-- bootstrap-table -->
<script src="__TMPL__Public/assets/plugins/bootstrap-table/js/bootstrap-table.js"></script>
<script src="__TMPL__Public/assets/plugins/bootstrap-table/js/bootstrap-table-zh-CN.js"></script>
<script src="__TMPL__Public/assets/plugins/bootstrap-table/js/bootstrap-table-export.js"></script>
<script src="__TMPL__Public/assets/plugins/bootstrap-table/js/tableExport.js"></script>
<!-- nicescroll -->
<script src="__TMPL__Public/assets/plugins/nicescroll/nicescroll.js"></script>
<!-- FastClick -->
<script src="__TMPL__Public/assets/plugins/fastclick/fastclick.min.js"></script>
<!-- XMenuTree -->
<script src="__TMPL__Public/assets/plugins/xMenutree/js/xmenutree.js"></script>
<!-- XPopup -->
<script src="__PUBLIC__/xPopup/js/xpopup.js"></script>
<!-- zTree -->
<script src="__TMPL__Public/assets/plugins/zTree/js/jquery.ztree.core-3.5.js"></script>
<script src="__TMPL__Public/assets/plugins/zTree/js/jquery.ztree.excheck-3.5.js"></script>
<script src="__TMPL__Public/assets/plugins/zTree/js/menu4ztree.js"></script>
<!-- AdminLTE App -->
<script src="__TMPL__Public/assets/js/app.js"></script>
<!-- xtreetable -->
<script src="__TMPL__Public/assets/plugins/xTreetable/js/xtreetable.js"></script>
<!-- common -->
<script src="__PUBLIC__/common.js"></script>
<!-- xupload -->
<script src="__TMPL__Public/assets/plugins/xUpload/js/xupload.js"></script>
<!-- xqupload -->
<script src="__TMPL__Public/assets/plugins/xqupload/xqupload.js"></script>
<!-- datepicker -->
<script src="__TMPL__Public/assets/plugins/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<!-- daterangepicker -->
<script src="__TMPL__Public/assets/plugins/bootstrap-daterangepicker/moment.min.js"></script>
<script src="__TMPL__Public/assets/plugins/bootstrap-daterangepicker/daterangepicker.js"></script>
<!-- qrcode
<script src="__PUBLIC__/jquery/jquery.qrcode.min.js"></script> -->
<!-- ueditor -->
<script src="__PUBLIC__/ueditor/ueditor.config.js"></script>
<script src="__PUBLIC__/ueditor/ueditor.all.js"></script>
<!-- qiniu
<script src="__TMPL__Public/assets/js/qiniu.js"></script> -->
<!-- localResizeIMG -->
<script src="__TMPL__Public/assets/plugins/localResizeIMG/lrz.bundle.js"></script>
<!-- bootstrap-slider -->
<script src="__TMPL__Public/assets/plugins/bootstrap-slider/js/bootstrap-slider.js"></script>
<!-- bootstrap-star-rating -->
<script src="__TMPL__Public/assets/plugins/bootstrap-star-rating/js/star-rating.min.js"></script>
<!-- xrs -->
<script src="__TMPL__Public/assets/plugins/xrs/xrs.js"></script>

<script>
$(function () {
	/* Finish loading */
	$(window).load(function() {
		$('.xloading').remove();
    });
	
	// 合适位置???
   	if (!'${ADMIN_MENUS}') {
   		xpopup.notify({
           	style: 'mini',
           	type: 'error',
           	title: '登录过期',
			msg: '请重新登录',
			delay: 3000,
			position: 'center',
			afterClose: function() {
				location.replace('/Admin/Login/login');
            }
		});
   	}
	
	/* create menu tree :k+ */
	xmenutree('.sidebar', {
		data: {$_SESSION["ADMIN_MENUS"]},
		onLoadSuccess: kk.extOnLoadSuccess,				// 扩展就先写在这里+++
		onLoadError: kk.extOnLoadError,
		animationSpeed: 200,
    	parentIcon : '',
    	childIcon : 'fa fa-genderless',
    	handler: function(data) {
    		if (data.action) {
    			loadContent('/' + data.app + '/' + data.controller + '/' + data.action);
    		}
    	},
    	afterShow: function() {
     		if ($('.sidebar-menu').has('a').length) {
    			$('.sidebar-menu').find('a').get(0).click();			// $this的$elem也写在这里了+++
			} else {
               	xpopup.alert({
           	    	type: 'warning',
                   	title: '警告',
           	        msg: '菜单无内容，请重新登录或联系管理员授予。',
        	        buttons: [{
                        text: 'OK',
                        'class': '',
                        handler: function ($this) {
                    		$this.destroy();
                			location.replace('/Admin/Login/login');		// login.php +++ 这句不能理想执行，可能与Session有关
                        }
                    }]
           	    });
			}
    	}
	});
});

/* clearCache */
function clearCache() {
	var xloading = xpopup.loading();
	
   	$.ajax({
   		type: 'PUT',
   		url: "{:U('Setting/Setting/clearCache')}",
   		data: null,
        dataType: 'json',
       	success: function(data) {
       		xloading.destroy();
       		
       		if (data.code == 0) {
		   		xpopup.notify({
		           	style: 'mini',
		           	type: 'success',
//		           	title: '操作成功',
					msg: data.msg,
					delay: 1000,
					position: 'center',
				});
   			}
       	}
   	});
}

/* 个人面板相关代码 */
var editPasswordDom = '\
<form class="form-horizontal" id="editPasswordForm">\
	<div class="form-group">\
		<label for="username" class="col-sm-2 control-label">用户名<span class="text-red">*</span></label>\
		<div class="col-sm-10">\
			<input type="text" class="form-control" id="username" name="username" placeholder="用户名">\
		</div>\
	</div>\
	<div class="form-group">\
		<label for="password" class="col-sm-2 control-label">当前密码<span class="text-red">*</span></label>\
		<div class="col-sm-10">\
			<input type="text" class="form-control" id="password" name="password" placeholder="当前密码">\
		</div>\
	</div>\
	<div class="form-group">\
		<label for="newPassword" class="col-sm-2 control-label">新设密码<span class="text-red">*</span></label>\
		<div class="col-sm-10">\
			<input type="text" class="form-control" id="newPassword" name="newPassword" placeholder="新设密码">\
		</div>\
	</div>\
	<div class="form-group">\
		<label for="confirmPassword" class="col-sm-2 control-label">确认密码<span class="text-red">*</span></label>\
		<div class="col-sm-10">\
			<input type="text" class="form-control" id="confirmPassword" name="confirmPassword" placeholder="确认密码">\
		</div>\
	</div>\
</form>\
';

function editPassword() {
	var validator;
	
	xpopup.window({
	    width: 600,
		title: '修改密码',
	    content: editPasswordDom,
        buttons: [{
        	id:	'btnOk',
            text: '确定',
            'class': 'btn btn-info btn-flat',
            handler: function ($this) {
    	 		if (validator.form() && doEditPassword($this)) {
            		$this.destroy();
    	 		}
            }
        }, {
        	id:	'btnCancel',
            text: '取消',
            'class': 'btn btn-default btn-flat',
            handler: function ($this) {
        		$this.destroy();
            }
        }],
        afterShow: function ($this) {
        	validator = $("#editPasswordForm").validate({
    			onfocusout: function(element) {
    				$(element).valid();
    			},
                rules: {
        			username: "required",
        			password: {
        				required: true,
        				minlength: 1
        			},
        			newPassword: {
        				required: true,
        				minlength: 1
        			},
        			confirmPassword: {
        			    required: true,
        			    minlength: 1,
        			    equalTo: "#newPassword"
        			}
                },
                messages: {
        			username: "请输入用户名",
        			password: {
        		    	required: "请输入密码",
        		    	minlength: "密码不能小于\{0\}个字 符"
        			},
        			newPassword: {
        		    	required: "请输入新密码",
        		    	minlength: "密码不能小于\{0\}个字 符"
        			},
        			confirmPassword: {
        			    required: "请确认密码",
        			    minlength: "确认密码不能小于5个字符",
        			    equalTo: "两次输入密码不一致不一致"
        			}
                }
            });
        }
	});
}

function doEditPassword(xpw) {
   	var url = '/api/users/password.json';
   	var username = $('#username').val();
   	var password = $('#password').val();
   	var newPassword = $('#newPassword').val();
   	$.ajax({
   		type: 'PUT',
   		url: url,
   		data: {
       		username: username,
       		password: password,
       		newPassword: newPassword
       	},
        dataType: 'json',
       	success: function(data) {
       		if (data.code == 0) {
       			xpw.destroy();
		   		xpopup.notify({
		           	style: 'mini',
		           	type: 'success',
//		           	title: '操作成功',
   	                msg: data.msg,
					delay: 1000,
					position: 'center',
				});
   			} else {
   			    xpopup.alert({
   			    	type: 'error',
   	            	title: 'Error',
   			        msg: data.msg,
   			        buttons: [{
   			        	id: 'btnOk',
   			            text: 'OK',
   			            'class': '',
   			            handler: function ($this) {
   			        		$this.destroy();
   			            }
   			        }]
   			    });
       		}
       	}
   	});
}

/** loadContent */
function loadContent(uri) {
   	var xloading = xpopup.loading();
   	$('.content').empty().load(uri, function(response, status, xhr) {
       	xloading.destroy();
		
    	// 先判断返回status
    	if (status != 'success') {
    		xpopup.alert({
    		    type: 'error',
    	       	title: 'ERROR',
    	        msg: xhr.status + ', ' + xhr.statusText,
    	        buttons: [{
    	            text: 'OK',
    	            'class': '',
    	            handler: function ($this) {
    	        		$this.destroy();
    	            }
    	        }]
    	    });
    	}
       	
		// 通过正则表达式判断返回值是否为json格式，如是，则说明加载页面异常
	    if (kk.strIsJson(response)) {
	    	$('.content').empty();
			kk.extOnLoadSuccess(JSON.parse(response));
	    }
   	});
}
</script>
</body>
</html>
